import 'package:flutter/material.dart';

import '../model/video_model.dart';
import '../util/view_util.dart';

class ExpandableContent extends StatefulWidget {
  final VideoModel mo;

  const ExpandableContent({super.key, required this.mo});

  @override
  State<ExpandableContent> createState() => _ExpandableContentState();
}

class _ExpandableContentState extends State<ExpandableContent> with SingleTickerProviderStateMixin {
  static final Animatable<double> _easeInTween = CurveTween(curve: Curves.easeIn);
  bool _expand = false;

  //用来管理Animation
  late AnimationController _controller;

  //生成动画高度的值
  late Animation<double> _heightFactor;

  @override
  void initState() {
    super.initState();
    _controller = AnimationController(duration: const Duration(milliseconds: 200), vsync: this);
    _heightFactor = _controller.drive(_easeInTween);
    _controller.addListener(() {
      //监听动画值的变化
      print(_heightFactor.value);
    });
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.only(left: 15, right: 15, top: 5),
      child: Column(
        children: [
          _buildTitle(),
          const SizedBox(height: 8),
          _buildInfo(),
          _buildDes(),
        ],
      ),
    );
  }

  _buildTitle() {
    return InkWell(
      onTap: _toggleExpand,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          //通过Expanded让Text获得最大宽度，以便显示省略号
          Expanded(child: Text(widget.mo.title, maxLines: 1, overflow: TextOverflow.ellipsis)),
          const SizedBox(width: 15),
          Icon(_expand ? Icons.keyboard_arrow_up_sharp : Icons.keyboard_arrow_down_sharp, color: Colors.grey, size: 16)
        ],
      ),
    );
  }

  void _toggleExpand() {
    setState(() {
      _expand = !_expand;
      if (_expand) {
        //执行动画
        _controller.forward();
      } else {
        //反向执行动画
        _controller.reverse();
      }
    });
  }

  _buildInfo() {
    var style = const TextStyle(fontSize: 12, color: Colors.grey);
    var dateStr = widget.mo.createTime.length > 10 ? widget.mo.createTime.substring(5, 10) : widget.mo.createTime;
    return Row(
      children: [
        ...smallIconText(Icons.ondemand_video, widget.mo.view),
        const SizedBox(width: 10),
        ...smallIconText(Icons.list_alt, widget.mo.duration),
        const SizedBox(width: 10),
        Text(dateStr, style: style)
      ],
    );
  }

  _buildDes() {
    var child = _expand ? Text(widget.mo.title, style: const TextStyle(fontSize: 12, color: Colors.grey)) : null;
    //构建动画的通用widget
    return AnimatedBuilder(
        animation: _controller.view,
        builder: (BuildContext context, Widget? child) {
          return Align(
            heightFactor: _heightFactor.value,
            //fix 从布局之上的位置开始展开
            alignment: Alignment.topCenter,
            child: Container(
              //会撑满宽度后，让内容对其
              alignment: Alignment.topLeft,
              padding: const EdgeInsets.only(top: 8),
              child: child,
            ),
          );
        },
        child: child);
  }
}
